<template>
  <div class="center">
    <!-- 头部 -->
    <div class="table_header flex flex_bet flex-wrap">
      <div class="table_button">
        <el-button type="primary" icon="el-icon-refresh" size="mini" @click="Refresh"></el-button>
        <el-button type="primary" icon="el-icon-plus" size="mini" @click="btnaddBrand">创建模板</el-button>
      </div>
      <div class="table_searchs flex felx_align">
        <div class="table_search flex">
          <el-input placeholder="搜索" v-model="searchTable" class="input-with-select" size="small">
            <el-select v-model="select" slot="prepend" placeholder="请选择" class="table_select" style="width:105px">
              <el-option label="模板名称" value="1"></el-option>
              <el-option label="适配学龄段" value="2"></el-option>
            </el-select>
            <el-button slot="append" icon="el-icon-search" @click="idnameSearch"></el-button>
          </el-input>
        </div>
        <dynamicTable :checkboxVal="checkboxVal" @alter="alterCheckbok" />
      </div>
    </div>
    <!-- table -->
    <el-table stripe style="width: 100%" :data="tableData" :key="key" border fit highlight-current-row ref="tableDataRef">
      <el-table-column v-if="colData[0].istrue" min-width="50" align="center" prop="launcher_id" label="模板ID"></el-table-column>
      <el-table-column v-if="colData[1].istrue" min-width="130" align="center" prop="launcher_name" label="名称"></el-table-column>
      <el-table-column v-if="colData[2].istrue"  align="center" prop="suitable_grade" label="适配学龄段">
        <template slot-scope="scope">
          <span v-if="scope.row.suitable_grade==1">幼儿</span>
          <span v-if="scope.row.suitable_grade==2">小学</span>
          <span v-if="scope.row.suitable_grade==3">初中</span>
          <span v-if="scope.row.suitable_grade==4">高中</span>
        </template>
      </el-table-column>
      <el-table-column v-if="colData[3].istrue"  min-width="100" align="center" prop="batch" label="分发批次">
        <template slot-scope="scope">
          <p v-for="(item,index) in scope.row.batch" :key="item.id" style="margin: 0;padding: 0">{{item.batch}}</p>
        </template>
      </el-table-column>
      <el-table-column v-if="colData[4].istrue" min-width="80" align="center" prop="operates" label="分发子账号">
        <template slot-scope="scope">
          <p v-for="(item,index) in scope.row.operates" :key="item.id" v-show="item.id != userId" style="margin: 0;padding: 0">{{item.username}}</p>
        </template>
      </el-table-column>
      <el-table-column v-if="colData[5].istrue" min-width="120" align="center"  label="关联模板">
        <template slot-scope="scope">
          <p v-for="(item,index) in scope.row.relationArr" :key="item.launcher_id" style="margin: 0;padding: 0">{{item.launcher_name}}</p>
        </template>
      </el-table-column>
      <el-table-column v-if="colData[6].istrue" min-width="80" align="center" prop="page_num" label="页面数"></el-table-column>
      <el-table-column v-if="colData[7].istrue" min-width="80" align="center" prop="admin_name" label="创建人"></el-table-column>
      <el-table-column v-if="colData[8].istrue" min-width="140" align="center" prop="send_time" label="分发时间">
        <template slot-scope="scope">{{scope.row.send_time| newDate}}</template>
      </el-table-column>
      <el-table-column v-if="colData[9].istrue" min-width="140" align="center" prop="create_time" label="更新时间">
        <template slot-scope="scope">{{scope.row.update_time| newDate}}</template>
      </el-table-column>

      <el-table-column  min-width="200" align="center" prop="name" label="UI定制">
        <template slot-scope="scope">
          <el-button size="mini" type="primary" @click="setLauncherControl(scope.row.launcher_id)">样式定制</el-button>
          <el-button size="mini" type="primary" @click="setPageControl(scope.row.launcher_id, scope.row.launcher_name)">页面定制</el-button>
        </template>
      </el-table-column>
      <el-table-column min-width="200" align="center" prop="log" label="操作">
        <template slot-scope="scope">
          <el-row>
            <el-button size="mini" type="primary" @click="openEditDesktop(scope.row)">编辑</el-button>
            <el-button size="mini" @click="getdeleteLauncherControl(scope.row.launcher_id)">删除</el-button>
            <el-popover placement="left" width="200" trigger="click">
              <el-button size="mini" type="text" @click="openLauncherSend(scope.row)">分发</el-button>
              <el-button size="mini" type="text" @click="openRelationLauncher(scope.row)">模板关联</el-button>
              <el-button size="mini" type="text" @click="copyLauncher(scope.row.launcher_id)">复制</el-button>
              <el-button slot="reference" size="mini" >更多</el-button>
            </el-popover>
          </el-row>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <div class="paging">
      <el-pagination background :current-page.sync="listQuery.startSize" @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[10, 50, 100, 200]" layout="total, sizes, prev, pager, next, jumper" :total="total" :page-size="listQuery.pageSize">
      </el-pagination>
    </div>

    <el-dialog :visible.sync="dialogFormVisible" width="500px" top="8vh" @close="addFormclose" title="桌面定制" :close-on-click-modal="false" :close-on-press-escape="false">
      <el-form :model="addForm" ref="ruleForm" :rules="rules" class="diolog_adapt" style="width: 400px">
        <el-form-item label="模板名称" label-width="120px" prop="launcher_name">
          <el-input v-model="addForm.launcher_name" autocomplete="off" placeholder="请输入模板名称最多输入15个字" ></el-input>
        </el-form-item>
        <el-form-item label="屏幕分辨率(宽)*高" label-width="120px" prop="whtype">
          <el-select v-model="addForm.whtype" placeholder="请选择">
            <el-option
              v-for="item in whOption"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="适配学龄设置" label-width="120px" prop="suitable_grade">
          <el-select v-model="addForm.suitable_grade" placeholder="请选择适配学龄段">
            <el-option
              v-for="item in gradeOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="创建学龄段名称" label-width="120px">
          <el-input v-model="addForm.grade_name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label-width="120px">
          <el-button v-if="isEditDialog" type="primary" @click="getEditLauncher('ruleForm')">立即修改</el-button>
          <el-button v-else type="primary" @click="getAddLauncher('ruleForm')">立即创建</el-button>
          <el-button @click="dialogFormVisible = false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-dialog title="模板分发"  :visible.sync="sendDialogVis"  width="30%" @close="clearBatchForm">
      <el-form ref="batchForm" :model="batchForm" label-width="100px">
        <el-form-item label="分发方式:">
          <el-radio-group v-model="batchForm.send_type">
            <el-radio :label="1" v-show="isShowSpecific">指定sn</el-radio>
<!--            <el-radio :label="2">批次</el-radio>-->
<!--            <el-radio :label="3">子账号</el-radio>-->
            <el-radio :label="4">批次与子账号</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="指定sn:" v-show="batchForm.send_type==1">
          <el-input v-model="batchForm.sn" placeholder="请输入设备号"  autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="请选择批次:" v-show="batchForm.send_type==4">
          <el-select v-model="batchForm.batch"  multiple filterable placeholder="请选择">
            <el-option
              v-for="item in batchArr"
              :key="item.id"
              :label="item.batch"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="请选择子账号:" v-show="batchForm.send_type==4">
        <el-select v-model="batchForm.childAdmin"  multiple placeholder="请选择">
          <el-option
            v-for="item in childrenOption"
            :key="item.id"
            :label="item.username"
            :value="item.id.toString()">
          </el-option>
        </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="sendDialogVis = false">取 消</el-button>
    <el-button type="primary" @click="batchFormSend">确 定</el-button>
     </span>
    </el-dialog>

    <el-dialog title="模板关联"  :visible.sync="relationDialogVis"  width="30%" @close="closeRelation">
      <el-form ref="relationForm" :model="relationForm" label-width="80px">
        <el-form-item label="模板关联:">
          <el-select v-model="relationForm.launcherArr" placeholder="请选择" multiple value-key="launcher_id">
            <el-option-group
              v-for="group in launchOption"
              :key="group.label"
              :label="group.label">
              <el-option
                v-for="item in group.options"
                :key="item.launcher_id"
                :label="item.launcher_name"
                :value="item">
              </el-option>
            </el-option-group>
          </el-select>
        </el-form-item>
        <el-form-item label="主模板">
          <el-select v-model="relationForm.firstLauncher" placeholder="请选择" @focus="setChooseLauncher">
            <el-option
              v-for="item in chooseLauncherArr"
              :key="item.launcher_id"
              :label="item.launcher_name"
              :value="item.launcher_id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模板可选">
          <el-radio-group v-model="relationForm.show_choose">
            <el-radio :label="1">显示</el-radio>
            <el-radio :label="-1">不显示</el-radio>
          </el-radio-group>

        </el-form-item>
        <el-form-item label="显示方式:" v-show="relationForm.show_choose==1">
          <el-radio-group v-model="relationForm.name_type">
            <el-radio :label="1">按年级</el-radio>
            <el-radio :label="2">按模板名称</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
    <el-button @click="relationDialogVis = false">取 消</el-button>
    <el-button type="primary" @click="editRelationLauncher">确 定</el-button>
     </span>
    </el-dialog>

    <!-- 删除弹窗 -->
    <delete-Dialog title="删除模板" :visible.sync="deleteDialogs.show" width="25%" top="40vh" @deleteEvents="deleteEvents" :deleteText="deleteDialogs.deleteText" />
  </div>
</template>

<script>
  import dynamicTable from "@/components/DynamicTable";
  import objectable from "@/utils/objectable.js";
  import { deleteLauncherControl, addLauncher, queryLauncherControl,editLauncher,launcherSendControl,getRelationLauncher} from "@/api/launcherMade.js";
  import wallpaper from '../../customMade/wallpaper/index'
  import deleteDialog from "@/components/deleteDialog";
  import {getBatchTwo} from "@/api/equipment";
  import {copyDefaultLauncher} from "@/api/launcherMade";
  export default {
    components: { dynamicTable, wallpaper, deleteDialog },
    data() {
      return {
        checkboxVal: ["模板id", "名称", "适配学龄段","分发批次", "分发子账号", "关联模板", "页面数", "创建人", "分发时间", "更新时间"],
        key: 1,
        colData: [], //动态控制table
        total: 0,
        searchTable: "",
        select: "", //搜索条件
        //归属table
        tableData: [],
        //添加按钮控制
        dialogFormVisible: false,
        //编辑按钮控制
        editSubjects: true,
        listQuery: { startSize: 1, pageSize: 10, userId: localStorage.getItem("ID"), name: undefined, package: undefined, username: undefined, batch: undefined, sort: '' },
        //添加表单
        addForm: {
          launcher_name: '',
          height: '',
          width: '',
          suitable_grade: '',
          grade_name: '',   //创建的学龄段名称
          whtype: '', //所选宽高类型
        },
        batchData: [],//批次列表
        //删除弹窗
        deleteDialogs: { show: false, deleteText: '', deleteId: 0 },
        uploadLink: process.env.VUE_APP_BASE_API,
        gradeOptions: [{label: '幼儿', value: 1}, {label: '小学', value: 2}, {label: '初中', value: 3}, {label: '高中', value: 4}],
        rules: {
          launcher_name: [{ required: true, message: "请输入模板名称", trigger: "blur" }],
          whtype: [{ required: true, message: '请选择屏幕分辨率', trigger: 'change' }],
          suitable_grade: [{ required: true, message: '请选择适配年龄', trigger: 'change' }],
        },
        batchForm: {
          send_type: 0,
          sn: '',
          childAdmin: [],  //所选子账号
          launcher_id: 0,
          batch: [],
        },
        relationForm: {
          launcherArr: [],
          name_type: '',
          launcher_id: 0,
          firstLauncher: '',
          show_choose: 1,
        },
        //分发dialog按钮
        sendDialogVis: false,
        isEditDialog: false,
        relationDialogVis: false,
        launchOption: [],
        childrenOption: [],  //子账号可选框
        batchArr: [],
        chooseLauncherArr: [],
        whOption: [{label:'1280*800', value:1},{label:'1920*1080', value:2},{label:'1920*1200', value:3},{label:'2000*1200', value:4}],
        userId: localStorage.getItem("ID"),
      }
    },
    created() {
      this.colData = objectable(this.checkboxVal, this.checkboxVal); //转为数组对象，好控制table
      this.getQueryLauncherControl()
      this.getBatchTwo()
    },
    methods: {
      //删除
      getdeleteLauncherControl(id) {
        this.deleteDialogs.show = true
        this.deleteDialogs.deleteId = id
      },
      //删除按钮事件
      deleteEvents() {
        let params = { userId: localStorage.getItem("ID"), last_ip: sessionStorage.getItem("Ip"), launcher_id: this.deleteDialogs.deleteId }
        deleteLauncherControl(params).then(res => {
          this.$message.success(res.msg)
          this.getQueryLauncherControl()
        })
      },

      //打开创建模板
      btnaddBrand() {
        this.isEditDialog = false
        this.editSubjects = true
        this.dialogFormVisible = true
      },
      //打开编辑按钮
      openEditDesktop(row) {
        this.dialogFormVisible=true
        this.isEditDialog=true
        this.addForm = row
      },
      //修改模板
      getEditLauncher(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            let addForm = JSON.parse(JSON.stringify(this.addForm))
            addForm.last_ip = sessionStorage.getItem("Ip")
            addForm.userId = localStorage.getItem("ID")
            addForm.type = 1
            editLauncher(addForm).then(res => {
              this.$message.success(res.msg)
              this.getQueryLauncherControl()
              this.dialogFormVisible = false
            }).catch(err => { })
          } else {
            return false;
          }
        });

      },
      //添加模板
      getAddLauncher(formName) {
        this.$refs[formName].validate(valid => {
          if (valid) {
            let addForm = JSON.parse(JSON.stringify(this.addForm))
            addForm.last_ip = sessionStorage.getItem("Ip")
            addForm.userId = localStorage.getItem("ID")
            addLauncher(addForm).then(res => {
              this.$message.success(res.msg)
              this.getQueryLauncherControl()
              this.dialogFormVisible = false
            }).catch(err => { })
          } else {
            return false;
          }
        });
      },

      getQueryLauncherControl() {
        queryLauncherControl(this.listQuery).then(res => {
          if(res.code==200){
            this.tableData = res.data
            this.total = res.total
          }else{
            this.$message.error(res.msg)
          }
        }).catch(err => {
          this.tableData = []
          this.total = 0
        })
      },
      //打开模板关联弹窗
      openRelationLauncher(row) {
        this.relationDialogVis = true
        this.relationForm.launcher_id = row.launcher_id
        this.relationForm.name_type = row.name_type
        this.relationForm.launcherArr = row.relationArr
        this.relationForm.show_choose = row.show_choose
        let first = row.relationArr[0] != undefined ? row.relationArr[0]  : undefined
        if(first) {
          this.chooseLauncherArr = [
            {launcher_id:parseInt(first.launcher_id), launcher_name:first.launcher_name, suitable_grade:first.suitable_grade},
            {launcher_id:parseInt(row.launcher_id), launcher_name:row.launcher_name,suitable_grade:row.suitable_grade}
          ]
        }else {
          this.chooseLauncherArr = [{launcher_id:row.launcher_id, launcher_name:row.launcher_name,suitable_grade:row.suitable_grade}]
        }
        this.relationForm.firstLauncher = row.firstLauncherId
        let queryForm = {
          launcher_id: row.launcher_id,
          suitable_grade: row.suitable_grade,
          userId: localStorage.getItem("ID")
        }
          getRelationLauncher(queryForm).then(res => {
            if(res.code==200){
              this.launchOption = res.data
            }else{
              this.$message.error(res.msg)
            }
          }).catch(err => {
          })
      },
      closeRelation(){
        this.launchOption = []
        this.relationForm.launcher_id = 0;
        this.relationForm.launcherArr = [];
        this.relationForm.name_type = '';
        this.relationForm.firstLauncher = '';
        this.relationForm.show_choose = 1;
      },
      clearBatchForm(){
        this.batchForm.send_type = 0
        this.batchForm.sn = ''
        this.batchForm.childAdmin = []
        this.batchForm.launcher_id = 0
        this.batchForm.batch = []
      },
      editRelationLauncher(){
        let relationForm = JSON.parse(JSON.stringify(this.relationForm))
        relationForm.last_ip = sessionStorage.getItem("Ip")
        relationForm.userId = localStorage.getItem("ID")
        relationForm.type = 2
        editLauncher(relationForm).then(res => {
          this.$message.success(res.msg)
          this.getQueryLauncherControl()
          this.relationDialogVis = false
        }).catch(err => { })
      },
      setChooseLauncher(e){
        let mergedArray = [...new Set([...this.chooseLauncherArr, ...this.relationForm.launcherArr])];
        var launcherIdArr = []
        var chooseLauncherArr = []
        for (var i=0; i<mergedArray.length; i++) {
          if(!launcherIdArr.includes(mergedArray[i].launcher_id)) {
            launcherIdArr.push(mergedArray[i].launcher_id)
            chooseLauncherArr.push(mergedArray[i])
          }
        }
        this.chooseLauncherArr = chooseLauncherArr
      },
      //打开模板分发
      openLauncherSend(row) {
        this.sendDialogVis = true
        this.batchForm.launcher_id = row.launcher_id
        this.childrenOption = row.childrenOption
        this.batchForm.send_type = row.send_type == 1 ? 1 : 4
        this.batchForm.batch = row.batchArr
        this.batchForm.childAdmin = row.childAdmin
      },
      //模板分发
      batchFormSend(){
        this.$loading({
          lock: true,
          text: '分发中,请稍等~',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)',
          fullscreen: true,
          customClass: 'myLoad'
        })
        let batchForm = JSON.parse(JSON.stringify(this.batchForm))
        batchForm.last_ip = sessionStorage.getItem("Ip")
        batchForm.userId = localStorage.getItem("ID")
        launcherSendControl(batchForm).then(res => {
          this.$message.success(res.msg)
          this.getQueryLauncherControl()
          this.sendDialogVis = false
          this.$loading().close()
        }).catch(err => {
          this.$loading().close()
        })
      },
      copyLauncher(launcher_id) {
        let form = {
          launcher_id: launcher_id,
          userId: localStorage.getItem("ID")
        }
        copyDefaultLauncher(form).then(res => {
          this.$message.success(res.msg)
          this.getQueryLauncherControl()
        }).catch(err => {})

      },
      handleSizeChange(val) {
        this.listQuery.pageSize = val
        this.getQueryLauncherControl();
      },
      handleCurrentChange(val) {
        this.listQuery.startSize = val
        this.getQueryLauncherControl();
      },
      //搜索,1:模板名称，2：适配学龄段 3：批次
      idnameSearch() {
        if (!this.select) return this.$message.warning("请先选择查询条件");
        this.listQuery.startSize = 1
        this.listQuery.pageSize = 10
        switch (this.select) {
          case '1':
            this.listQuery.launcher_name = this.searchTable
            this.getQueryLauncherControl();
            break;
          case '2':
            switch (this.searchTable) {
              case '幼儿':
                this.listQuery.suitable_grade = 1;
                break
              case '小学':
                this.listQuery.suitable_grade = 2;
                break
              case "初中":
                this.listQuery.suitable_grade = 3;
                break
              case "高中":
                this.listQuery.suitable_grade = 4;
                break
              default:
                this.$message.warning('请输入幼儿、小学、初中、高中、任意一个')
            }
            this.getQueryLauncherControl();
            break;
          case '3':
            this.listQuery.username = this.searchTable
            this.getQueryLauncherControl();
            break;
          case '4':
            let search = this.batchData.filter(key => key.batch == this.searchTable).map(item => item.id)[0]
            this.listQuery.batch = search ? search : this.searchTable
            this.getQueryLauncherControl();
            break;
        }
      },

      Refresh() {
        this.listQuery = { startSize: 1, pageSize: 10, userId: localStorage.getItem("ID"), launcher_name: undefined, age: undefined, username: undefined, batch: undefined, sort: '' }
        this.getQueryLauncherControl()
      },
      //编辑添加表单关闭事件
      addFormclose() {
        this.$nextTick(() => {
          this.$refs.ruleForm.resetFields();
          this.addForm = { launcher_name: "", height: '', width: '', age:'',grade_name:'', grade: '' }
        })
      },
      //下拉动态table子组件
      alterCheckbok(key, conte) {
        this.key = key;
        this.colData.filter(i => {
          if (conte.indexOf(i.title) != -1) {
            i.istrue = false;
            this.$nextTick(() => {
              this.$refs.tableDataRef.doLayout();
            });
          } else {
            i.istrue = true;
            this.$nextTick(() => {
              this.$refs.tableDataRef.doLayout();
            });
          }
        });
      },
      getBatchTwo() {
        getBatchTwo({ userId: localStorage.getItem('ID') }).then(res => {
          this.batchArr = res.data
        }).catch(err => {
          this.batchArr = []
        })
      },

      setLauncherControl(id) {
        this.$router.push({name:'customLauncher', query:{launcher_id: id}});
      },
      setPageControl(id, launcher_name) {
        this.$router.push({name:'customPage', query:{launcher_id: id, launcher_name: launcher_name}});
      }
    },
    mounted() {

    },
    computed: {
      isShowSpecific() {
        if(localStorage.getItem('auth_group_id') == 1 || localStorage.getItem('ID') ==11){
          return true
        }else {
          return false
        }
      }

    }
  }
</script>

<style lang="scss" scoped>
  .content_left {
    height: 100%;
    .log-picture {
      max-height: 625px;
      overflow: auto;
      h2 {
        font-weight: 500;
        margin-top: 0;
      }
    }
    .upLogo {
      .logo_Title {
        margin-right: 5px;
      }
      .upload-demo {
        position: absolute;
        right: 10px;
      }
      .logo_upload {
        width: 75%;
        position: relative;
      }
    }
    .facility {
      text-align: center;
    }
    .picture {
      text-align: center;
      margin-top: 40px;
    }
    .logo_text {
      margin-top: 40px;
      display: flex;
      justify-content: center;
      span {
        display: inline-block;
        width: 250px;
        font-size: 14px;
        line-height: 25px;
        p {
          margin: 0;
          font-size: 16px;
          padding-bottom: 10px;
        }
      }
    }
    .download-log {
      margin-top: 40px;
      display: flex;
      justify-content: center;
      .download-template {
        width: 250px;
        a {
          background-color: #252e3c;
          height: 40px;
          display: block;
          line-height: 40px;
          width: 110px;
          text-align: center;
          color: #70a1e2;
        }
      }
    }
  }
  .desktop-bj {
    // height: 625px;
    height: 100%;
    padding: 20px;
    background-repeat: no-repeat !important;
    background-size: 100% 100% !important;
    .desktop-top {
      //height: 70px;
      img {
        height: 100%;
        width: 100%;
      }
    }
    .desktop-center {
      margin-top: 20px;
      height: 80%;
      .bj-left {
        width: 30%;
        // border-radius: 20px;
        overflow: hidden;
        img {
          width: 100%;
          height: 100%;
        }
      }
      .bj-right {
        width: 70%;
        img {
          width: 100%;
          height: 100%;
        }
        .classroom {
          height: 48.5%;
          .classroom-left {
            width: 50%;
            // border-radius: 20px;
            overflow: hidden;
            margin: 0 20px;
          }
          .classroom-right {
            width: 50%;
            // border-radius: 20px;
            overflow: hidden;
          }
        }
        .app-bj {
          height: 47.5%;
          .app {
            width: 31%;
            // border-radius: 20px;
            overflow: hidden;
          }
        }
      }
    }
  }
  .img_index {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    font-weight: 600;
    font-size: 20px;
  }
  .foot-img {
    ul {
      margin-top: 20px;
      padding: 0 50px;
      li {
        width: 60px;
        height: 60px;
        img {
          height: 100%;
          width: 100%;
        }
      }
    }
  }
  .back_one {
    background-image: url("../../../assets/images/custoMede1.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 5%;
  }
</style>

<style scoped>
  /deep/ .el-dialog__body {
    padding: 10px 20px 0 20px;
  }
  /deep/ .el-form-item__label {
    font-size: 12px;
  }
</style>
